

import React, { Component } from 'react'

export default class ToDoList extends Component {

        state={val:'',list:[]};
        changeValue=(e)=>{
            this.setState({val:e.target.value});
        }
        addItem =(e) =>{
            if(e.keyCode == 13){

                // this.state.list.push(this.state.val);
                // this.setState({list:this.state.list});
                // console.log(this.state.val);

                this.setState({list:[this.state.val,...this.state.list]});
                console.log(this.state.list);
            }
        }
    render() {
        const {val,list} = this.state;
        return (
            <div>
                <input 
                onChange={this.changeValue} 
                value={val}
                onKeyUp={this.addItem}
                />
                <ul>
                    {this.state.list.map( val=><li key={val}>{val}</li>)}
                </ul>
            </div>
        )
    }
}
